<template>
	<view class="content">
		<view class="chang-time">
			<view class="c-t-o" v-if="ctany != 1" @click="chang_dang(1)">
				本期
			</view>
			<view class="c-t-o c-t-oo" v-if="ctany == 1" >
				本期
			</view>
			<view class="c-t-o" v-if="ctany != 2" @click="chang_dang(2)">
				上期
			</view>
			<view class="c-t-o c-t-oo" v-if="ctany == 2" >
				上期
			</view>
			<view class="c-t-o" v-if="ctany != 3" @click="chang_dang(3)">
				上月
			</view>
			<view class="c-t-o c-t-oo" v-if="ctany == 3">
				上月
			</view>
			<view class="c-t-o" v-if="ctany != 4" @click="chang_dang(4)">
				本季
			</view>
			<view class="c-t-o c-t-oo" v-if="ctany == 4">
				本季
			</view>
			
		</view>
		<view class="rech-hd" >
			<view class="riqi">
				{{ssstr}}
			</view>
			<view class="feiyong">
				<view class="fuwufei">
					当期服务费(元)
					<text>{{total_servicemoney}}</text>
				</view>
				<view class="fuwufei">
					总收入(元)
					<text>{{total_allmoney}}</text>
				</view>
				<view class="fuwufei">
					当期车费(元)
					<text>{{total_carmoney}}</text>
				</view>
			</view>
			<view class="jine">
				<view class="zongjine">
					{{money}}
					<text>钱包余额(元)</text>
				</view>
				<navigator class="tixian" url="../my/withdraw">
					提现
				</navigator>
			</view>
		<!-- 	<view class="rech-hd-tit">可提现金额</view>
			<view class="rech-hd-con">
				<text>{{money}}</text>
			</view>
			<view class="acc-btn">
				<navigator url="../my/withdraw">提现</navigator>
			</view> -->
		</view>
		<view class="acc-pri" style="display: none;">
			<view class="acc-pri-con">
				<view class="acc-pri-num">
					<text>{{total_income}}</text>
				</view>
				<view class="acc-pri-tit">总收入</view>
			</view>
			<view class="acc-pri-con">
				<view class="acc-pri-num">
					<text>{{total_travel_price}}</text>
				</view>
				<view class="acc-pri-tit">总车费</view>
			</view>
			<view class="acc-pri-con">
				<view class="acc-pri-num">
					<text>{{total_no_money}}</text>
				</view>
				<view class="acc-pri-tit">未入账</view>
			</view>
		</view>
		
		<view class="tech-eva-con">
			<!-- <view class="place-rem-tit">
				<text>收入明细</text>
				<text></text>
			</view> -->
			<view class="record-con">
				<block v-for="(item, index) in money_log_list" :key="index">
					<view class="record-li">
						<view v-show="item.from_order_id != 0" @click="money_detail(item.id)">
							
						<view class="record-li-tp" style="font-weight: bold;">
							<view class="record-tp-lf">订单收益 ></view>
							<view class="record-tp-rt" style="color:red">¥{{item.techn_money}}</view>
						</view>
						<view class="record-li-bt">
							<view class="record-tp-lf">{{item.add_time_time}}</view>
							<view class="record-tp-rt"></view>
						</view>
						<view class="record-li-bt">
							<view class="record-tp-lf">订单号:{{item.order_no}}</view>
							<view class="record-tp-rt"></view>
						</view>
						
						</view>
						<view v-show="item.from_order_id == 0">
							
						<view class="record-li-tp" style="font-weight: bold;">
							<view class="record-tp-lf">金额提现</view>
							<view class="record-tp-rt" style="color:red">{{item.operation_type == 0 ? '-' : ''}}¥{{item.operation_money}}</view>
						</view>
						<view class="record-li-bt">
							<view class="record-tp-lf">{{item.add_time_time}}</view>
							<view class="record-tp-rt"></view>
						</view>
						
						</view>
					</view>
				</block>
			</view>
		</view>
	</view>
</template>

<script>
	const app = getApp();
	const request = require('../../utils/request');
	export default {
		data() {
			return {
				//可提现金额
				money:0,
				//总收入
				total_income:0,
				//总车费
				total_travel_price:0,
				//未入账
				total_no_money:0,
				
				//获取技师余额日志列表参数
				params:{
					page:1, //分页
				},
				//技师余额日志列表
				money_log_list:[],
				//上拉加载状态
				push_status:false,
				money_dian:0,
				ctany:1,
				total_allmoney:0,
				total_carmoney:0,
				total_servicemoney:0,
				ssstr:'',
			}
		},
		onLoad()
		{
			
		},
		onShow()
		{
			var that = this;
			that.load_money_info(); //获取技师账户信息
			
			that.params.page = 1;
			that.money_log_list = [];
			that.load_money_log(); //获取技师余额日志列表
		},
		onPullDownRefresh()
		{
			//console.log('下拉');
			var that = this;
			that.params.page = 1;
			that.money_log_list = [];
			that.load_money_log(); //获取技师余额日志列表
		},
		onReachBottom()
		{
			//console.log('上拉');
			var that = this;
			if(that.push_status == true)
			{
				that.load_money_log(true); //获取技师余额日志列表
			}
		},
		methods: {
			chang_dang(type){
				this.ctany = type;
				this.params.page = 1;
				this.load_money_info();
				this.load_money_log();
				
			},
			/**
			 * 获取技师账户信息
			 */
			load_money_info:function()
			{
				var that = this;
				//网络请求
				request(app.globalData.api_url+'/v1/money/index', 'POST', {type:this.ctany}).then((res) => {
					if(res.data.code == 0)
					{
						let info = res.data.data;
						//可提现金额
						that.money = info.money;
						//总收入
						that.total_income = info.total_income;
						//总车费
						that.total_travel_price = info.total_travel_price;
						//未入账
						that.total_carmoney = info.total_carmoney;
						that.total_allmoney = info.total_allmoney;
						that.total_servicemoney = info.total_servicemoney;
						that.ssstr = info.time_str;
					}else
					{
						uni.showToast({
							title:res.data.msg,
							icon:'none'
						});
						app.is_login_check(res.data);
						app.is_techn_check(res.data);
					}
				});
			},
			/**
			 * 获取技师余额日志列表
			 */
			load_money_log:function(is_push = false)
			{
				var that = this;
				var params = that.params;
				params.type = that.ctany;
				//网络请求
				request(app.globalData.api_url+'/v1/money/log_lists', 'POST', params).then((res) => {
					uni.stopPullDownRefresh();
					if(res.data.code == 0)
					{
						let money_log_list = that.money_log_list;
						if(is_push == true)
						{
							//追加
							money_log_list = money_log_list.concat(res.data.data);
						}else
						{
							//更改
							money_log_list = res.data.data;
						}
						that.money_log_list = money_log_list;
						that.params.page += 1;
						that.push_status = true;
					}else
					{
						uni.showToast({
							title:res.data.msg,
							icon:'none'
						});
						app.is_login_check(res.data);
						app.is_techn_check(res.data);
						that.push_status = false;
					}
				});
			},
			money_detail:function(order_id){
				var that = this;
				console.log(order_id);
				uni.navigateTo({
				            url: '/pages/my/money_detail?order_id='+order_id
				        })
				// request(app.globalData.api_url+'/v1/money/money_detail', 'POST', order_id).then((res) => {
					
				// 	if(res.data.code == 0)
				// 	{
						
				// 	}
				// });
			}
		}
	}
</script>

<style lang="scss">
page{
	background-color: $uni-bg-color-grey;
}
.content{
	.chang-time{
		width: 100%;
		height: 60rpx;
		display:flex;
		.c-t-o{
			text-align: center;
			width: 25%;
		}
		.c-t-oo{
			font-size: 36rpx;
			border-top: 8rpx solid $uni-text-color-active;
		}
		
	}
	.acc-pri{
		display: flex;
		background-color: #fff;
		padding:30rpx 0;
		.acc-pri-con{
			flex: 1;
			text-align: center;
			&:first-child{
				border-right: 2rpx solid  $uni-bg-color-grey;
			}
			.acc-pri-num{
				text{
					position: relative;
					font-size: 40rpx;
					&::before{
						position: absolute;
						left:-25rpx;
						bottom:5rpx;
						content: "￥";
						font-size: 24rpx;
					}
				}
			}
			.acc-pri-tit{
				margin-top:10rpx;
				font-size: 28rpx;
				color: $uni-text-color-grey;
			}
		}
	}
	.rech-hd{
		padding: 50rpx 0 50rpx;
		color: #fff;
		text-align: center;
		background-color:$uni-text-color-active;
		display: flex;
		border-radius: 30rpx;
		width: 96%;
		margin: 0 auto;
		.riqi{
			position: absolute;
			top: 40px;
			font-size: 26rpx;
			left: 38rpx;
		}
		.feiyong{
			    width: 60%;
			    margin-top: 20rpx;
				text-align: left;
			.fuwufei{
				display: inline-block;
				width: 41%;
				margin-top: 10rpx;
				font-size: 26rpx;
				margin-left: 30rpx;
				text{
					display: block;
					font-weight: bold;
					font-size: 30rpx;
				}
				&:last-child{
					margin-top: 20rpx;
				}
			}
		}
		.jine{
			margin-left: 40rpx;
			margin-top: 14rpx;
			font-size: 46rpx;
			font-weight: bold;
			.zongjine{
				
				text{
					display: block;
					font-size: 26rpx;
				}
			}
			.tixian{
				margin-top: 20rpx;
				padding: 10rpx 10rpx;
				background-color: white;
				border-radius: 60rpx;
				color: #109A81;
				font-size: 30rpx;
			}
		}
		.acc-btn{
			margin-top: 30rpx;
			navigator{
				display: inline-block;
				padding:10rpx 50rpx;
				border-radius:30rpx;
				font-size: 24rpx;
				background-color:#fff;
				color:$uni-text-color-active;
			}
		}
		.rech-hd-tit{
			font-size: 28rpx;
			margin-bottom: 20rpx;
		}
		.rech-hd-con{
			text{
				font-size:70rpx;
				&::before{
					content: "￥";
					font-size:32rpx;
				}
			}
		}
	}
	.tech-eva-con{
		margin:30rpx 20rpx;
		border-radius:20rpx;
		padding:20rpx 30rpx;
		background-color: #fff;
		.record-con{
			.record-li{
				padding:20rpx 0;
				border-bottom: 2rpx solid  $uni-bg-color-grey;
				&:last-child{
					border-bottom: none;
				}
				.record-li-tp{
					display: flex;
					justify-content: space-between;
					font-size: 28rpx;
					margin-bottom: 5rpx;
				}
				.record-li-bt{
					display: flex;
					justify-content: space-between;
					font-size: 24rpx;
					color: $uni-text-color-grey;
					.record-tp-rt{
						text{
							color: #f00;
						}
					}
				}
			}
		}
		.place-rem-tit{
			font-size: 28rpx;
			margin: 20rpx 0;
			text{
				&:first-child{
					font-weight: bold;
				}
				&:last-child{
					font-size: 24rpx;
					color: $uni-text-color-grey;
				}
			}
		}
	}
}
</style>